import React from 'react'
import {Empty} from 'antd-mobile'
import {imgPre} from '../../../../request/http'
import { Link } from "react-router-dom";
import './Goods.less'
function Goods(porps) {
    let {goods,n,changeN} = porps
    var arr=["热门商品", "全部商品", "打折商品","其他商品"];
    return (
        <div className="goods">
            <div className="nav">
                {
                    arr.map((item,index)=>{
                        return (
                        <span key={item} className={index===n?"active":""} onClick={()=>changeN(index)}>{item}</span>
                        )
                    })
                }
            </div>
            {
                goods.length>0?<div className="list">{
                    goods[n].content.map(item=>{
                        return(
                            <Link to={"/Detail/"+item.id} className="item" key={item.id}>
                                <img src={imgPre + item.img} alt="" />
                                <div>goodsname:{item.goodsname}</div>
                            </Link>
                        )
                })}</div>: <Empty description='暂无数据' />
            }
        </div>
    )
}

export default React.memo(Goods)